<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta name="renderer" content="webkit">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
		<title>index</title>
		<link rel="stylesheet" href="../../source/plugins/layui/css/layui.css" />
		<link rel="stylesheet" href="../../source/plugins/font-awesome/css/font-awesome.min.css">
		<link rel="stylesheet" href="../../source/css/public.css" />
		<link rel="stylesheet" href="../../source/css/build.css" />
	</head>
	<body>
		<div class="layui-layout-admin admin-allbox">
			<!--header start-->
			<header class="layui-header header layui-clear" id="admin-header">
				<!-- logo区域 -->
				<div class="admin-header-logo">
					<a class="logo" href="">
						<dl>
							<dt class="layui-elip">绿色装配式建设数字化建造信息系统</dt>
							<dd class="layui-elip">Digitized Construction System od Green Assembly Building</dd>
						</dl>
					</a>
				</div>
				<!-- 顶级菜单区域 -->
				<nav class="header-top-nav">
					<div class="nav-box">
						<div class="nav-inbox" id="navtop-box">
							<a class="nav-box-link active" href="index.html">
								<dl>
									<dt>
										<i class="fa fa-user-o" ></i>
									</dt>
									<dd>个人管理</dd>
								</dl>
							</a>
							<a class="nav-box-link" href="index.html">
								<dl>
									<dt>
										<i class="layui-icon">&#xe614;</i>
									</dt>
									<dd>系统管理</dd>
								</dl>
							</a>
							<a class="nav-box-link" href="build-leftmenu.html">
								<dl>
									<dt>
										<i class="fa fa-users" aria-hidden="true"></i>
									</dt>
									<dd>组织管理</dd>
								</dl>
							</a>
							<a class="nav-box-link"  href="build-leftmenu2.html">
								<dl>
									<dt><i class="fa fa-line-chart "></i></dt>
									<dd>市场跟踪</dd>
								</dl>
							</a>
							<a class="nav-box-link"  href="index.html">
								<dl>
									<dt><i class="layui-icon">&#xe614;</i></dt>
									<dd>项目管理</dd>
								</dl>
							</a>
							<a class="nav-box-link"  href="build-leftmenu2.html">
								<dl>
									<dt><i class="layui-icon">&#xe614;</i></dt>
									<dd>供应商管理</dd>
								</dl>
							</a>
							<a class="nav-box-link" href="project.html">
								<dl>
									<dt><i class="layui-icon">&#xe614;</i></dt>
									<dd>采购寻源</dd>
								</dl>
							</a>
							<a class="nav-box-link active" href="index.html">
								<dl>
									<dt>
										<i class="fa fa-user-o" ></i>
									</dt>
									<dd>个人管理</dd>
								</dl>
							</a>
						</div>
					</div>
					<div class="nav-updown" id="nav-updown">
						<span class="nav-updown-up" data-updown="up"><i class="layui-icon">&#xe619;</i></span>
						<span class="nav-updown-down active" data-updown="down"><i class="layui-icon">&#xe61a;</i></span>
					</div>
				</nav>

				<!-- 头部右侧导航 -->
				<div class="header-top-usercenter">
					<ul class="layui-nav">
						<li class="layui-nav-item">
							<a href="javascript:;" class="admin-head-user">
								<img src="../../source/images/head.jpg" class="admin-head-userimg layui-circle">
								<span class="admin-head-username">王某某</span>
							</a>
							<ul class="layui-nav-child layui-anim layui-anim-upbit">
								<li>
									<a href="">
										<i class="layui-icon icon-maright5">&#xe612;</i>
										<span>个人资料</span>
									</a>
								</li>
								<li>
									<a href="">
										<i class="layui-icon icon-maright5">&#xe612;</i>
										<span>退出</span>
									</a>
								</li>
		
							</ul>
						</li>
					</ul>
				</div>

				<!-- 消息框 -->
				<div class="header-top-news">
					<ul class="layui-nav">
						<li class="layui-nav-item">
							<a href="javascript:;" class="admin-head-news">
								<i class="fa fa-bell-o" aria-hidden="true"></i>
								<span class="admin-news-tips">8</span>
							</a>
							<ul class="layui-nav-child layui-anim layui-anim-upbit">
								<li class="admin-news-list">
									<a href="">
										<section class="admin-news-title">
											<h5>标题标题</h5>
											<time>5分钟前</time>
										</section>
										<p class="admin-news-text layui-elip">消息内容消息内容消息内容消息内容消息内容消息内容消息内容</p>
									</a>
								</li>
								<li class="admin-news-list">
									<a href="">
										<section class="admin-news-title">
											<h5>标题标题</h5>
											<time>5分钟前</time>
										</section>
										<p class="admin-news-text layui-elip">消息内容消息内容消息内容消息内容消息内容消息内容消息内容</p>
									</a>
								</li>
								<li class="admin-news-list">
									<a href="">
										<section class="admin-news-title">
											<h5>标题标题</h5>
											<time>5分钟前</time>
										</section>
										<p class="admin-news-text layui-elip">消息内容消息内容消息内容消息内容消息内容消息内容消息内容</p>
									</a>
								</li>
								<li class="admin-news-list">
									<a href="">
										<section class="admin-news-title">
											<h5>标题标题</h5>
											<time>5分钟前</time>
										</section>
										<p class="admin-news-text layui-elip">消息内容消息内容消息内容消息内容消息内容消息内容消息内容</p>
									</a>
								</li>
								<li class="admin-news-list">
									<a href="">
										<section class="admin-news-title">
											<h5>标题标题</h5>
											<time>5分钟前</time>
										</section>
										<p class="admin-news-text layui-elip">消息内容消息内容消息内容消息内容消息内容消息内容消息内容</p>
									</a>
								</li>
								<li class="admin-news-null" style="display: none;">
									<i class="fa fa-envelope-open-o" aria-hidden="true"></i><span>暂无消息</span>
								</li>
								<li class="admin-news-list">
									<a href="">
										<p class="admin-news-all">查看所有消息<i class="fa fa-angle-right" aria-hidden="true"></i></p>
									</a>
								</li>
							</ul>
						</li>
					</ul>
				</div>
					
			</header>
			<!--header end-->

			<!--build system-->
			<section class="build-wrapper">
				<div class="build-main">
					<section class="build-subproject build-module">
						<div class="build-subproject-left">
							<div class="subproject-top-tips">
								<img src="../../source/images/build-toptips.png">
								<div class="top-text">
									<div><span>10</span><p>人参与</p></div>
								</div>
							</div>
							<dl class="subproject-con">
								<dt>
									<img src="../../source/images/build-item-img.png" alt="">
								</dt>
								<dd class="item-title">项目管理</dd>
								<dd class="item-allnum">
									<i class="fa fa-file-text-o" aria-hidden="true"></i>
									<span>20</span>个项目
								</dd>
								<dd class="item-subnum">
									<i class="fa fa-check" aria-hidden="true"></i>
									<span>10</span>个完成
								</dd>
								<dd class="item-subnum">
									<i class="fa fa-paper-plane" aria-hidden="true"></i>
									<span>10</span>个进行中
								</dd>
							</dl>
						</div>
						<div class="build-subproject-right">
							<ul class="subproject-item">
								<li class="subproject-list">
									<dl>
										<dt>
											<img src="../../source/images/build-case01.png">
										</dt>
										<dd class="subproject-text">
											<ul>
												<li>项目总额：<span>2000万</span></li>
											</ul>
										</dd>
										<dd class="subproject-graph" id="projectTotal">
											
										</dd>
									</dl>
								</li>
								<li class="subproject-list">
									<dl>
										<dt>
											<img src="../../source/images/build-case02.png">
										</dt>
										<dd class="subproject-text">
											<ul>
												<li>本月收入：<span>2000万</span></li>
												<li>本月支出：<span>2000万</span></li>
											</ul>
										</dd>
										<dd class="subproject-graph" id="projectThismonth">
											
										</dd>
									</dl>
								</li>
								<li class="subproject-list">
									<dl>
										<dt>
											<img src="../../source/images/build-case03.png">
										</dt>
										<dd class="subproject-text">
											<ul>
												<li>累计收入：<span>2000万</span></li>
												<li>累计支出：<span>2000万</span></li>
											</ul>
										</dd>
										<dd class="subproject-graph" id="projectCumulative">
											
										</dd>
									</dl>
								</li>
							</ul>
						</div>
						
					</section>
					<section class="build-process build-module build-padding">
						<div class="build-title-box">
							<div class="build-title-left">
								<section class="build-search">
									<input type="text" placeholder="请输入关键字，按Enter进行搜索" id="buildSearchKeyDown">
									<div class="build-search-btn" id="buildSearchBtn"></div>
								</section>
							</div>
							<div class="build-title-right layui-form">

								<select name="city">
								  <option value="1">所有项目</option>
								  <option value="2">未完成</option>
								  <option value="3">已完成</option>
								  <option value="4">进行中</option>
								</select>  
								<div class="build-todo">
									<div class="layui-btn-group build-btn-group build-btn-turn" id="buildShowListOrItem">
									  <button class="layui-btn layui-btn-radius active">
									  	<i class="fa fa-th" aria-hidden="true"></i>
									  </button>
									  <button class="layui-btn layui-btn-radius">
									  	<i class="fa fa-bars" aria-hidden="true"></i>
									  </button>
									</div>
								</div>
							</div>
						</div>
						<ul class="build-project-item build-show-type">
							<li class="build-project-list">
								<div href="#" class="build-project-link">
									<a href="#"><img src="../../source/images/build-card-1.png" alt="card1"></a>
									<div class="build-project-sub">
										<section class="build-project-item-top">
											<dl>
												<dt><img src="../../source/images/build-project-img.png" alt="project-head"></dt>
												<dd>项目经理</dd>
											</dl>
										</section>
										<section class="build-project-item-bottom">
											<div class="left">
												<span>参与人员数量：6</span>
											</div>
											<div class="right">
												<i class="fa fa-heart-o build-collection" aria-hidden="true"></i>
											</div>
										</section>
									</div>
								</div>
							</li>
							<li class="build-project-list">
								<div href="#" class="build-project-link">
									<a href="#"><img src="../../source/images/build-card-2.png" alt="card1"></a>
									<div class="build-project-sub">
										<section class="build-project-item-top">
											<dl>
												<dt><img src="../../source/images/build-project-img.png" alt="project-head"></dt>
												<dd>项目经理</dd>
											</dl>
										</section>
										<section class="build-project-item-bottom">
											<div class="left">
												<span>参与人员数量：6</span>
											</div>
											<div class="right">
												<i class="fa fa-heart-o build-collection" aria-hidden="true"></i>
											</div>
										</section>
									</div>
								</div>
							</li>
							<li class="build-project-list">
								<div href="#" class="build-project-link">
									<a href="#"><img src="../../source/images/build-card-3.png" alt="card1"></a>
									<div class="build-project-sub">
										<section class="build-project-item-top">
											<dl>
												<dt><img src="../../source/images/build-project-img.png" alt="project-head"></dt>
												<dd>项目经理</dd>
											</dl>
										</section>
										<section class="build-project-item-bottom">
											<div class="left">
												<span>参与人员数量：6</span>
											</div>
											<div class="right">
												<i class="fa fa-heart-o build-collection" aria-hidden="true"></i>
											</div>
										</section>
									</div>
								</div>
							</li>
							<li class="build-project-list">
								<div href="#" class="build-project-link">
									<a href="#"><img src="../../source/images/build-card-1.png" alt="card1"></a>
									<div class="build-project-sub">
										<section class="build-project-item-top">
											<dl>
												<dt><img src="../../source/images/build-project-img.png" alt="project-head"></dt>
												<dd>项目经理</dd>
											</dl>
										</section>
										<section class="build-project-item-bottom">
											<div class="left">
												<span>参与人员数量：6</span>
											</div>
											<div class="right">
												<i class="fa fa-heart-o build-collection" aria-hidden="true"></i>
											</div>
										</section>
									</div>
								</div>
							</li>
						</ul>
						<div class="build-process-table build-show-type" style="display: none">
							<div class="submain-table">
								<table id="qingdan-list" class="table" cellspacing="0" lay-skin="nob" cellspacing="0">
									<thead>
										<tr>
											<th></th>
											<th class="text-center">
												<label for="" class="checkbox">
													<input type="checkbox" id="checkall" />
													<i class="checkbox-inner"></i>
												</label>
											</th>
											<th>清单编号</th>
											<th>项目编号</th>
											<th>项目名称</th>
											<th>子项目编号</th>
											<th>子项目名称</th>
											<th>创建人</th>
											<th>审核状态</th>
											<th>创建时间</th>
										</tr>
									</thead>
								</table>
							</div>
						</div>
						
					</section>
				</div>
				<div class="build-aside">
					<aside>
						<section  class="build-lastnews build-module build-padding">
							<div class="build-title-box">
								<div class="build-title-left">
									<h2 class="build-title">最高风险</h2>
								</div>
								<div class="build-title-right">
									<a href="#" class="button-normal">more</a>
								</div>
							</div>
							<ul class="build-lastnews-item">
								<li class="build-lastnews-list">
									<a href="#" class="build-lastnews-link">
										<div class="build-lastnews-text layui-elip">
											<i class="fa fa-caret-right" aria-hidden="true"></i>
											<span class="detail-tips-hover">最高风险(高)</span>
										</div>
										<time class="build-lastnews-time">2017-06-11</time>
									</a>
								</li>
								<li class="build-lastnews-list">
									<a href="#" class="build-lastnews-link">
										<div class="build-lastnews-text layui-elip">
											<i class="fa fa-caret-right" aria-hidden="true"></i>
											<span class="detail-tips-hover">最高风险(高)</span>
										</div>
										<time class="build-lastnews-time">2017-06-11</time>
									</a>
								</li>
								<li class="build-lastnews-list">
									<a href="#" class="build-lastnews-link">
										<div class="build-lastnews-text layui-elip">
											<i class="fa fa-caret-right" aria-hidden="true"></i>
											<span class="detail-tips-hover">最高风险(高)</span>
										</div>
										<time class="build-lastnews-time">2017-06-11</time>
									</a>
								</li>
								<li class="build-lastnews-null" style="display: none;">
									<i class="fa fa-envelope-open-o" aria-hidden="true"></i><span>暂无消息</span>
								</li>
							</ul>
						</section>
						<section  class="build-lastnews build-module build-padding">
							<div class="build-title-box">
								<div class="build-title-left">
									<h2 class="build-title">待办流程</h2>
								</div>
								<div class="build-title-right">
									<a href="#" class="button-normal">more</a>
								</div>
							</div>
							<ul class="build-lastnews-item">
								<li class="build-lastnews-list">
									<a href="#" class="build-lastnews-link">
										<div class="build-lastnews-text layui-elip">
											<i class="fa fa-caret-right" aria-hidden="true"></i>
											<span class="detail-tips-hover">最高风险(高)</span>
										</div>
										<time class="build-lastnews-time">2017-06-11</time>
									</a>
								</li>
								<li class="build-lastnews-list">
									<a href="#" class="build-lastnews-link">
										<div class="build-lastnews-text layui-elip">
											<i class="fa fa-caret-right" aria-hidden="true"></i>
											<span class="detail-tips-hover">最高风险(高)</span>
										</div>
										<time class="build-lastnews-time">2017-06-11</time>
									</a>
								</li>
								<li class="build-lastnews-list">
									<a href="#" class="build-lastnews-link">
										<div class="build-lastnews-text layui-elip">
											<i class="fa fa-caret-right" aria-hidden="true"></i>
											<span class="detail-tips-hover">最高风险(高)</span>
										</div>
										<time class="build-lastnews-time">2017-06-11</time>
									</a>
								</li>
								<li class="build-lastnews-null" style="display: none;">
									<i class="fa fa-envelope-open-o" aria-hidden="true"></i><span>暂无消息</span>
								</li>
							</ul>
						</section>
					</aside>
				</div>
			</section>
		</div>

	<script src="../../source/plugins/layui/layui.js"></script>
	<script src="../../source/plugins/datatables/jquery-1.12.4.js"></script>
	<script src="../../source/js/index.js"></script>
	<script src="../../source/js/tab.js"></script>
	<script src="../../source/plugins/datatables/jquery.dataTables.min.js"></script>
	<script src="../../source/plugins/datatables/dataTables.fixedColumns.js"></script>
	<script src="../../source/js/datatables-config.js"></script>
	<script type="text/javascript" src="../../source/plugins/echart/echarts.min.js"></script>
	<script src="../../source/js/system.js"></script>
	<script src="../../source/js/build.js"></script>
	<script>
		
		var employee = {
			tableId: "qingdan-list", //table的id
			status: [ //设置哪些列不能排序和搜索
				{
					"searchable": false,
					"orderable": false,
					"targets": [0, 1, 2, 6, 7, 8,]
				}, //第n行不进行排序和搜索
				//					{
				//			            "visible": false,//设置哪列不显示
				//			            "targets": [-1]
				//			        }
			],
			order: [
				[3, 'asc']
			], //初始时，按列排序
			scrollX: true, //是否允许横向滚轴
			checkAllId: "checkall", //第一列checkbox的id
			sScrollXInner: "100%", //设置table的宽度
			fixedColumns: { //左右边定位
				"leftColumns": 0,
				"rightColumns": 0
			},
			url: "build.json", //url链接
			filed: [ //列对应
				{
					"data": "list_number",
					"createdCell": function(nTd, sData, oData, iRow, iCol) {
						$(nTd).html(iRow + 1);
					},
					"class": "text-center",
					"width": "30px"
				},
				{
					"data": "list_number",
					"createdCell": function(nTd, sData, oData, iRow, iCol) {
						$(nTd).html('<label for="" class="checkbox">' +
							'<input type="checkbox" class="checkchild" name="' + sData + '"/>' +
							'<i class="checkbox-inner"></i>' +
							'</label>');
					},
					"class": "text-center",
					"width": "50px"
				},
				{
					"data": "list_number"
				},
				{
					"data": "item_number"
				},
				{
					"data": "item_name"
				},
				{
					"data": "subitem_number"
				},
				{
					"data": "subitem_name"
				},
				{
					"data": "creater"
				},
				{
					"data": "status"
				},
				{
					"data": "time"
				}
			]
		};
		dataTablesInit(employee); //实例化

		layui.use(['form'], function(){

		})

		$(function(){
			var projectTotal = echarts.init(document.getElementById('projectTotal'));
			var projectThismonth = echarts.init(document.getElementById('projectThismonth'));
			var projectCumulative = echarts.init(document.getElementById('projectCumulative'));
	        option_total = {
			    color: ['#7cb782'],
			    tooltip : {
			        trigger: 'axis',
			        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
			            type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
			        }
			    },
			    grid: {
			        left: '0',
			        right: '0',
			        bottom: '0',
			        containLabel: true
			    },
			    xAxis : [
			        {
			            type : 'category',
			            data : ['项目总额(万)'],
			            axisTick: {
			                alignWithLabel: true
			            }
			        }
			    ],
			    yAxis : [
			        {
			            type : 'value'
			        }
			    ],
			    series : [
			        {
			            name:'',
			            type:'bar',
			            barWidth: '60%',
			            data:[2100]
			        }
			    ]
			};
			option_thismonth = {
			    color: ['#7cb782'],
			    tooltip : {
			        trigger: 'axis',
			        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
			            type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
			        }
			    },
			    grid: {
			        left: '0',
			        right: '0',
			        bottom: '0',
			        containLabel: true
			    },
			    xAxis : [
			        {
			            type : 'category',
			            data : ['本月收入(万)', '本月支出(万)'],
			            axisTick: {
			                alignWithLabel: true
			            }
			        }
			    ],
			    yAxis : [
			        {
			            type : 'value'
			        }
			    ],
			    series : [
			        {
			            name:'',
			            type:'bar',
			            barWidth: '60%',
			            data:[320, 220]
			        }
			    ]
			};
			option_cumulative = {
			    color: ['#7cb782'],
			    tooltip : {
			        trigger: 'axis',
			        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
			            type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
			        }
			    },
			    grid: {
			        left: '0',
			        right: '0',
			        bottom: '0',
			        containLabel: true
			    },
			    xAxis : [
			        {
			            type : 'category',
			            data : ['累计收入(万)', '累计支出(万)'],
			            axisTick: {
			                alignWithLabel: true
			            }
			        }
			    ],
			    yAxis : [
			        {
			            type : 'value'
			        }
			    ],
			    series : [
			        {
			            name:'',
			            type:'bar',
			            barWidth: '60%',
			            data:[3010, 2090]
			        }
			    ]
			};
			projectTotal.setOption(option_total);
		    projectThismonth.setOption(option_thismonth);
		    projectCumulative.setOption(option_cumulative);

	        $(window).resize(function(){
	        	projectTotal.resize();
		        projectThismonth.resize();
		        projectCumulative.resize();
	        });

		})
	</script>
	</body>
</html>
